<template>
  <div>
    <el-button type="text" icon="el-icon-circle-plus" size="mini" @click="openShop">EPC导入</el-button>
    <!-- 弹框 -->
    <el-dialog
      v-dialogDrag
      ref="dialog"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :visible.sync="dialogVisible"
      :append-to-body="true"
      title="配件选择"
      width="70%"
      @close="clear">
      <!-- 查询条件 -->
      <el-form ref="searchForm" :model="search" label-width="95px" label-position="right" size="mini">
        <el-row :gutter="6">
          <el-col :xs="24" :sm="12" :md="8">
            <el-form-item prop="orderNo" label="EPC订单号">
              <!--<el-input v-model="search.orderNo" clearable/>-->
              <r-select
                v-model="search.orderNo"
                :url="`/part/common/getEpcCode/${userInfo.dealerCode}`"
                placeholder="请选择"
                selectid="ORDER_NO"
                selectname="ORDER_NO"
                model="DMSCLOUD_PART"
                filterable
              />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8">
            <el-form-item prop="partCode" label="配件代码">
              <el-input v-model="search.partCode" clearable/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8">
            <el-form-item prop="partName" label="配件名称">
              <el-input v-model="search.partName" clearable/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8">
            <el-form-item prop="orderDate" label="接收日期">
              <el-date-picker
                v-model="search.orderDate"
                :unlink-panels="true"
                type="daterange"
                value-format="yyyy-MM-dd"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
              />
            </el-form-item>
          </el-col>
          <div style="text-align:right">
            <el-button type="primary" icon="el-icon-search" @click="searchHandle">查询</el-button>
            <el-button icon="el-icon-refresh" @click="resetForm('searchForm')">重置</el-button>
          </div>
        </el-row>
      </el-form>
      <div class="table">
        <!--<div class="tableHead">
          <div class="title">配件信息</div>
        </div>-->
        <el-table v-loading="load" ref="table" :data="partList" tooltip-effect="dark" border>
          <el-table-column label="序号" type="index" min-width="40"/>
          <el-table-column prop="partNo" label="配件代码" min-width="150" show-overflow-tooltip/>
          <el-table-column prop="partName" label="配件名称" min-width="150" show-overflow-tooltip/>
          <el-table-column prop="unit" label="计量单位" min-width="80"/>
          <el-table-column prop="minPackage" label="最小包装数" min-width="90"/>
          <el-table-column v-if="orderFormObj.isOem !== 10041001" prop="dlrStock" label="账面库存" min-width="70"/>
          <el-table-column prop="orderQuantity" label="采购数量" min-width="70"/>
          <!--<el-table-column prop="MIN_ORDER_GOODS" label="最小订货量" min-width="90"/>-->
          <el-table-column :formatter="formatCurrency" prop="unitPrice" label="单价" min-width="100"/>
          <el-table-column prop="remark" label="备注" min-width="100" show-overflow-tooltip/>
        </el-table>
        <!-- 分页 -->
        <div style="text-align:right">
          <Pagination :data="page" @change-size="handleSizeChange" @change-page="handleCurrentChange"/>
        </div>
      </div>
      <div slot="footer" class="dialog-footer" style="text-align: center">
        <el-button type="text">
          <i class="el-icon-search magnifier" />
        </el-button>
        <el-button type="primary" @click="req">确 定</el-button>
        <el-button @click="clear">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getEpcPartList
} from '@/api/part/dms/ordermanage/partOrder'
import Pagination from '@/components/Pagination'
import formMixins from '@/mixins/formMixins'
import { mapGetters } from 'vuex'
import rSelect from '@/components/Select/Select'
import BaseTable from '@/components/BaseTable'
import _ from 'lodash'

export default {
  name: 'PartSelect',
  components: {
    Pagination,
    rSelect,
    BaseTable
  },
  mixins: [formMixins],
  props: {
    orderFormObj: Object
  },
  data() {
    return {
      partList: [],
      load: false,
      page: {},
      search: {
        limit: 5,
        pageNum: 1,
        orderNo: '',
        orderDate: [],
        partCode: '',
        partName: '',
        orderType: '',
        dealerCode: '',
        saleOrgCode: '',
        priceType: ''
      },
      dialogVisible: false
    }
  },
  computed: {
    ...mapGetters(['userInfo', 'systemParam'])
  },
  mounted() {
  },
  methods: {
    // 查询代理商选择列表
    openShop() {
      if (this.orderFormObj != null) {
        if (this.orderFormObj.orderType === undefined || this.orderFormObj.orderType === '') {
          this.$message({
            type: 'info',
            message: '请选择订单类型!'
          })
          return
        } else {
          this.search.orderType = this.orderFormObj.orderType
        }
        if (this.orderFormObj.saleOrgCode === undefined || this.orderFormObj.saleOrgCode === '') {
          this.$message({
            type: 'info',
            message: '请选择供货单位!'
          })
          return
        } else {
          this.search.saleOrgCode = this.orderFormObj.saleOrgCode
        }
        if (this.orderFormObj.dealerCode === undefined || this.orderFormObj.dealerCode === '') {
          this.$message({
            type: 'info',
            message: '请选择订货单位!'
          })
          return
        } else {
          this.search.dealerCode = this.orderFormObj.dealerCode
        }

        this.search.priceType = this.orderFormObj.priceType
      }
      this.dialogVisible = true
    },
    searchHandle() {
      if (this.search.orderNo == undefined || this.search.orderNo === '') {
        this.$message({
          type: 'warning',
          message: '请输入EPC订单号!'
        })
        return
      }
      const search = _.extend(this.search)
      if (this.search.orderDate != null && this.search.orderDate.length > 0) {
        search.orderDateStr = this.search.orderDate[0]
        search.orderDateEnd = this.search.orderDate[1]
      } else {
        search.orderDateStr = ''
        search.orderDateEnd = ''
      }
      this.load = true
      getEpcPartList(search)
        .then(res => {
          this.partList = res.rows
          this.page = res
          this.load = false
        })
        .catch(err => {
          this.load = false
        })
    },
    // 选择分页
    handleSizeChange(size) {
      this.search.limit = size
      this.searchHandle()
    },
    handleCurrentChange(page) {
      this.search.pageNum = page
      this.searchHandle()
    },
    // 确定
    req() {
      if (this.partList.length === 0) {
        this.$message({
          type: 'info',
          message: '请选择数据!'
        })
        return
      }
      this.done()
    },
    done() {
      const partList = _.cloneDeep(this.partList)
      partList.forEach((item, index) => {
        if (item.unitPrice == null || item.unitPrice === 0) {
          this.$message({
            type: 'warning',
            message: item.partNo + '：价格异常，无法采购!'
          })
          partList.splice(index, 1)
        }
      })
      this.$emit('getEpcItemInfo', partList)
    },
    clear() {
      this.search = {
        limit: 5,
        pageNum: 1,
        orderNo: '',
        orderDate: [],
        partCode: '',
        partName: '',
        orderType: '',
        dealerCode: '',
        saleOrgCode: '',
        priceType: ''
      }
      this.partList = []
      this.page = {}
      this.dialogVisible = false
    }
  }
}

</script>

<style scoped>

</style>
